<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>发布微生活</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
		<meta name="keywords" content="" />
		<meta name="description" content="" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<link rel="stylesheet" href="css/news.css" />
		<link rel="stylesheet" href="css/style3.css" />
		<link rel="stylesheet" href="css/style4.css" />
		<link rel="stylesheet" type="text/css" href="css/style1.css">
		<link rel="stylesheet" type="text/css" href="css/style.css">
		<link rel="stylesheet" type="text/css" href="iconfont/iconfont.css">
		<script type="text/javascript" src="script/jquery-3.3.1.min.js"></script>
		<script type="text/javascript" src="script/bootstrap.min.js"></script>
		<link rel="stylesheet" href="css/mui.min.css">
		<script type="text/javascript" src="js/mui.js"></script>
		<link rel="stylesheet" type="text/css" href="css/feedback-page.css" />
		<script type="text/javascript" src="script/iconfont.js"></script>
		<link rel="stylesheet" href="css/index.css" />
		<link rel="stylesheet" href="css/brandmodel.css" />
		<script type="text/javascript" src="js/rem.js"></script>

		<script src="script/bootstrap.min.js"></script>
	    <link href="css/bootstrap.min.css" rel="stylesheet" />
		<style>
			input{
				color:#black;
				font-size:12px;
			}
			.mui-card .mui-control-content {
				padding: 10px;
			}

			.dynamic_images {
				width: 100%;
			}

			.dynamic_images ul {
				margin: 0;
				padding: 10px;
			}

			.dynamic_images ul li {
				float: left;
				list-style: none;
				width: 75px;
			}

			.dynamic_images ul li img {
				width: 98%;
				height: 75px;
			}

			.mui-input-group .mui-input-row {
				height: 40px;
			}

			.mui-input-row {
				position: relative;
			}

			mui.min.css:5 .mui-input-row {
				clear: left;
				overflow: hidden;
			}

			h5 {
				margin: 5px 7px;
			}

			.mui-page-content {
				width: 100%;
				height: 100%;
				background-color: #efeff4;
			}

			.feedback p {
				padding: 10px 15px 0;
				font-size: 16px;
				margin-top: 0;
				margin-bottom: 10px;
				color: #000;
			}

			.feedback textarea {
				height: 160px;
				margin-bottom: 0 !important;
				padding-bottom: 0 !important;
			}

			.brand-box {
				position: absolute;
				top: 0px;
				filter: alpha(opacity=60);
				background-color: #777;
				z-index: 1002;
				left: 0px;
				opacity: 0.5;
				-moz-opacity: 0.5;
			}

			.brand {
				vertical-align: middle;
				/*text-align: center;*/
			}

			.form {
				padding-left: 10px;
			}

			.car_info {
				padding-left: 10px;
			}
			.high{ color: red; }
		</style>
		<script>
			mui.back = function() {
			    var btn = ["确定", "取消"];
			    mui.confirm('确认关闭当前应用？', '提示', btn, function(e) {
			        if(e.index == 0) {
			            plus.runtime.quit();
			        }
			    });
			}
	
		</script>
		<script type="text/javascript">
			//兼容火狐、IE8
			//显示遮罩层
			function showMask() {
				//$("#form_info").hide();   infoheader
				document.getElementById('form_info').style.display = 'none';
				document.getElementById('infoheader').style.display = 'none';
				console.log($(document).height());
				console.log($(document).width());
//				$("#brand-box").show();
//				$("#brand-box").css("height", $(document).height());
//				$("#brand-box").css("width", $(document).width());
			}
			//隐藏遮罩层
			function hideMask() {
				//document.getElementById('brand-box').style.display='none';
				$("#brand-box").hide();
			}
		</script>
		<!--<<script>
			var picArr = new Array(); // 存储图片
			// 删除
			$(document).on('click', '#delete_pic', function(event) {
				var aa = $(this).parents(".pic_look").index();
				console.log(aa);
				picArr.splice(aa, 1);
				$(this).parents(".pic_look").remove();
			});
		</script>
-->		<!--<script>
			window.onload = function() {
				$("#brand-box").hide();
			}
		</script>
-->
		<!--<script src="js/mui.js"></script>-->
		<script src="js/mui.picker.min.js"></script>
		<script src="js/mui.picker.js"></script>
		<script src='js/feedback.js'></script>
		<script src="js/app.js"></script>
		<script>
			var files = [];
			var files2 = [];
			(function($, doc) {
				mui.init({
					swipeBack: true //启用右滑关闭功能
				});

				document.addEventListener("plusready", plusReady, false);

				function plusReady() {

					var wv = plus.webview.currentWebview();
					document.getElementById("addnew").addEventListener("tap", function() {
					var num = $(".pic_look.col-md-1.col-xs-4").length;

//						document.getElementById("number").innerHTML = num;
						if(num >= 15) {
							alert("最多不超过15张");
							document.getElementById("input").disabled = "disabled";
							$("#chose_pic_btn3").css("display", "none");
						} else {
							showActionSheet(); //拍照还是相册
						}

					});

					document.getElementById("addnew2").addEventListener("tap", function() {
					var num = $(".pic_look.col-md-1.col-xs-4").length;

//						document.getElementById("number").innerHTML = num;
						if(num >= 15) {
							alert("最多不超过15张");
							document.getElementById("input").disabled = "disabled";
							$("#chose_pic_btn3").css("display", "none");
						} else {
							showActionSheet2(); //拍照还是相册
						}

					});


					plus.nativeUI.closeWaiting();

				}
			}(mui, document));

			// 添加文件
			var index = 1;
			var index2 = 1
			var newUrlAfterCompress;

			function appendFile(p) {
				files.push({
					path: p,
					name: "photo_" + index
				});
				index++;
			}
			function appendFile2(p) {
				files2.push({
					path: p,
					name: "photo_" + index2
				});
				index2++;
			}
			// 产生一个随机数
			function getUid() {
				return Math.floor(Math.random() * 100000000 + 10000000).toString();
			}

			function galleryImgs() { // 从相册中选择图片
				plus.gallery.pick(function(e) {
					console.log("选择了" + e.files.length + "个图片");
					for(var i = 0; i < e.files.length; i++) {
						if(i < 9) {
							var _str = "<span class='pic_look col-md-1 col-xs-4' style='background-image: url(" + e.files[i] + ")'><em id='delete_pic'>-</em></span>";
							$('#chose_pic_btn3').before(_str);
							var dstname = "_downloads/" + getUid() + ".jpg"; //设置压缩后图片的路径
							newUrlAfterCompress = compressImage(e.files[i], dstname);
							appendFile(dstname);
						}
					}
				}, function(e) {
					console.log("取消选择图片");
				}, {
					filter: "image",
					multiple: true
				});
			}
			
			/*function removePic(){
				console.log(1);
				var aa = $(this).parents(".pic_look").index();
				console.log(aa);
				files.splice(aa, 1);
				$(this).parents(".pic_look").remove();
			}*/
			function galleryImgs2() { // 从相册中选择图片
				plus.gallery.pick(function(e) {
					console.log("选择了" + e.files.length + "个图片");
					for(var i = 0; i < e.files.length; i++) {
						if(i < 9) {
							var _str = "<span class='pic_look col-md-1 col-xs-4' style='background-image: url(" + e.files[i] + ")'><em id='delete_pic1'>-</em></span>";
							$('#chose_pic_btn2').before(_str);
							var dstname = "_downloads/" + getUid() + ".jpg"; //设置压缩后图片的路径
							newUrlAfterCompress = compressImage(e.files[i], dstname);
							appendFile2(dstname);
						}
					}
				}, function(e) {
					console.log("取消选择图片");
				}, {
					filter: "image",
					multiple: true
				});
			}
			$(document).on('click', '#delete_pic', function(event) {
				var aa = $(this).parents(".pic_look").index();
				console.log(aa);
				for(var i = aa + 1; i < files.length; i++){
					files[i].name = "photo_" + i;
					console.log(files[i].name);
				}
				files.splice(aa, 1);
				index--;
				$(this).parents(".pic_look").remove();
			});
			$(document).on('click', '#delete_pic1', function(event) {
				var aa = $(this).parents(".pic_look").index();
				console.log(aa);
				for(var i = aa + 1; i < files2.length; i++){
					files2[i].name = "photo_" + i;
				}
				files2.splice(aa, 1);
				index2--;
				$(this).parents(".pic_look").remove();
			});
			//压缩图片，这个比较变态的方法，无法return
			function compressImage(src, dstname) {
				plus.zip.compressImage({
						src: src,
						dst: dstname,
						overwrite: true,
						quality: 20
					},
					function(event) {
						return event.target;
					},
					function(error) {
						console.log(error);
						return src;
					});

			}

			function showActionSheet() {
				var bts = [{
					title: "拍照"
				}, {
					title: "从相册选择"
				}];
				plus.nativeUI.actionSheet({
						cancel: "取消",
						buttons: bts
					},
					function(e) {
						if(e.index == 1) {
							getImage();
						} else if(e.index == 2) {
							galleryImgs();
						}
					}
				);
			}
			function showActionSheet2() {
				var bts = [{
					title: "拍照"
				}, {
					title: "从相册选择"
				}];
				plus.nativeUI.actionSheet({
						cancel: "取消",
						buttons: bts
					},
					function(e) {
						if(e.index == 1) {
							getImage2();
						} else if(e.index == 2) {
							galleryImgs2();
						}
					}
				);
			}
			//拍照
			function getImage() {
				var cmr = plus.camera.getCamera();
				cmr.captureImage(function(p) {
					plus.io.resolveLocalFileSystemURL(p, function(entry) {
						var localurl = entry.toLocalURL(); //
						var _str = "<span class='pic_look col-md-1 col-xs-4' style='background-image: url(" + localurl + ")'><em id='delete_pic'>-</em></span>";
						$('#chose_pic_btn3').before(_str);
						var dstname = "_downloads/" + getUid() + ".jpg"; //设置压缩后图片的路径
						newUrlAfterCompress = compressImage(localurl, dstname);
						appendFile(dstname);
					});
				});
			}
			function getImage2() {
				var cmr = plus.camera.getCamera();
				cmr.captureImage(function(p) {
					plus.io.resolveLocalFileSystemURL(p, function(entry) {
						var localurl = entry.toLocalURL(); //
						var _str = "<span class='pic_look col-md-1 col-xs-4' style='background-image: url(" + localurl + ")'><em id='delete_pic'>-</em></span>";
						$('#chose_pic_btn2').before(_str);
						var dstname = "_downloads/" + getUid() + ".jpg"; //设置压缩后图片的路径
						newUrlAfterCompress = compressImage(localurl, dstname);
						appendFile2(dstname);
					});
				});
			}
		</script>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav" id="infoheader" style="background-color: #00002E">
			<div class="mo-header-left">
				<a href="#">
					<font color="#F8F8F8">首页 </font>
				</a>
				<font color="#F8F8F8"> <i class="mui-icon iconfont icon-youdayu"></i></font>
				<a href="#">
					<font color="#F8F8F8"> 发布信息 </font>
				</a>
			</div>
		</header>

		<div class="mui-content">
			<div style="padding: 10px 10px;">
				<div id="segmentedControl" class="mui-segmented-control">
					<a class="mui-control-item mui-active" href="#item1">轿车发布</a>
					<a class="mui-control-item" href="#item2">货车发布</a>
				</div>
			</div>
			<div>
				<div id="item1" class="mui-control-content mui-active">

					<form id="form_info1">
						<div class="upload_picture">
			                <div>选择照片时长按照片，再点击右上角图标选择打开可以一次上传多张</div>
							<span>上传照片(最多15张)<!--(已选择</span>  
							<span id="number">0</span>
							<span>/15)--></span>
						</div>

						<div class="release_up_pic">
							<div class="up_pic">
								<div id="chose_pic_btn3" class="col-md-1 col-xs-4">
									<img src="images/true.jpg" id="addnew">
								</div>
							</div>
						</div>


						<div class="car_info">车辆信息</div>

						<div class="form">
							<label class="form_control">是否新车:</label>
							<input type="radio" name="isNewCar" onclick="isNew(1)">是
							<input type="radio" name="isNewCar" onclick="isNew(0)" checked/>否
						</div>

						<div class="form">
							<label class="form_control">车辆类型:</label>
							<input id="cartype" type="hidden" />
							<ul class="cartp" id="carType">
								<li class="form_li" onclick="selecttype('轿车',0)">轿车</li>
								<li class="form_li" onclick="selecttype('SUV',1)">SUV</li>
								<li class="form_li" onclick="selecttype('MPV',2)">MPV</li>
							</ul>
						</div>

						<!--<div class="form">
							<label class="form_control">品牌型号:</label>
							<input type="text" id="brandmodel" class="brand"/>
							<a href="javascript:;" onclick="showMask()" class="pic">选择...</a>
						</div>-->
						<div class="form1">
							<div id="container">
								<div class="content">
									<div class="left">
										品牌型号：
									</div>
									<div class="right form-group">
										<input type="text" class="input" id="address" name="brandmodel" placeholder="请选择">
									</div>
								</div>
							</div>
							<section id="mymodal">
								<div class="modal-main">
									<p class="address-title">品牌型号</p>
									<p class="close">x</p>
									<ul class="optionwrapper">
										<li class="option-menu option-menu-one active-option">请选择</li>
										<li class="option-menu option-menu-two"></li>
										<li class="option-menu option-menu-three"></li>
									</ul>
									<div class="option-content">
										<ul class="option-group option-group-one" data-index="0" style="display: block">
										</ul>
										<ul class="option-group option-group-two" data-index="1">
										</ul>
										<ul class="option-group option-group-three"  data-index="2">
										</ul>
									</div>
								</div>
							</section>
						</div>

						<div class="form">
							<label class="form_control">排量:</label>
							<input type="text" id="outputvolume" class="brand"/>
						</div>

						<div class="form">
							<label class="form_control">变速箱:</label>
							<input id="transmission" type="hidden" />
							<ul class="transm">
								<li class="form_li" onclick="selecttransmission('手动',0)">手动</li>
								<li class="form_li" onclick="selecttransmission('自动',1)">自动</li>
							</ul>
						</div>

						<div class="form">
							<label class="form_control">车身颜色:</label>
							<span class="colorname" id="colornames"></span>
							<input class="color color1" type="radio" name="color"  id="white" value="白色" />
							<label for="white" onclick="selectcolor('white','白色')"></label>        
							<input class="color color2" type="radio" name="color"   id="black" value="黑色" />
							<label for="black" onclick="selectcolor('black','黑色')"></label>            
							<input class="color color3" id="silvery"  name="color"  type="radio" value="银色" />
							<label for="silvery" onclick="selectcolor('silvery','银色')"></label>
							<input class="color color4" id="gray"  name="color"  type="radio" value="灰色" />
							<label for="gray" onclick="selectcolor('gray','灰色')"></label>
							<input class="color color5" id="red"  name="color"  type="radio" value="红色" />
							<label for="red" onclick="selectcolor('red','红色')"></label>
							<input class="color color6" id="blue"  name="color"  type="radio" value="蓝色" />
							<label for="blue" onclick="selectcolor('blue','蓝色')"></label>
							<input class="color color7" type="radio"  name="color" id="brown" value="棕色" />
							<label for="brown" onclick="selectcolor('brown','棕色')" ></label>
							<input class="color color8" type="radio"  name="color" id="yellow" value="黄色" />
							<label for="yellow"  onclick="selectcolor('yellow','黄色')"></label>
							<svg class="icon" aria-hidden="true" onclick="selectcolor('qita','其他')">
					          <use xlink:href="#icon-qita"></use>
					        </svg>  
						</div>

						<div class="form">
							<li class="lis">
							    <section class="express-area">
							        <a id="expressArea" href="javascript:void(0)">
							            <div class="form-group">
							                <!--<dt>所在城市</dt>
							                <dd class="city">省 市</dd>-->
							                <span class="cityname">所在城市:</span>
							                <input type="text" class="city" name="citys" placeholder="省 市" style="width:50%;">
							            </div>
							        </a>
							    </section>
							    <section id="areaLayer" class="express-area-box">
							        <article id="areaBox">
							        	<ul class="remen" id="remen">
							        		<li class="lastli">热门城市</li>
							        		<li class="list">北京</li>
							        		<li class="list">上海</li>
							        		<li class="list">广州</li>
							        		<li class="list">深圳</li>
							        		<li class="list">天津</li>
							        		<li class="list">重庆</li>
							        	</ul>
							        	<div class="top">
								            <h3>选择城市</h3>
								        </div>
							            <ul id="areaList" class="area-list" style="margin-bottom: 500px;"></ul>
							        </article>
							    </section>
							    <div id="areaMask" class="mask"></div>
							</li>
						</div>
						<div class=isNew>
							<div class="form">
								<label class="form_control">行驶里程(万公里):</label>
								<input type="text" id="mileage" class="brand"/>
							</div>

							<div class="form">
								<label class="form_control">上牌日期:</label>
								<input type="text" id="registrationdate" onclick="selectdate()" placeholder="选择日期..." class="brand"></input>
								<div id="info"></div>
							</div>

							<div class="form">
								<label class="form_control">年检到期:</label>
								<input type="text" id="yearinsurance" onclick="selectdate1()" placeholder="选择日期..." class="brand" />
							</div>

							<div class="form">
								<label class="form_control">商业险到期:</label>
								<input type="text" id="commercialinsurance" onclick="selectdate2()" placeholder="选择日期..." class="brand" />
							</div>

							<div class="form">
								<label class="form_control">交强险到期:</label>
								<input type="text" id="compulsoryinsurance" onclick="selectdate3()" placeholder="选择日期..." class="brand" />
							</div>
						</div>
						<div class="form form-group">
							<label class="form_control">报价(万):</label>
							<input type="text" id="wholesaleprice" class="brand" name="price"/>
						</div>

						<div class="form">
							<label class="form_control">VIP底价(万):</label>
							<input type="text" id="vipfloorprice" class="brand"/>
						</div>

						<div class="vip">VIP会员享受VIP底价</div>


						<div class="form">
							<label class="form_control">排放标准:</label>
							<input id="paifang" type="hidden" />
							<ul class="output">
								<li class="form_li" onclick="selectpaifang('国五', 0)">国五</li>
						        <li class="form_li" onclick="selectpaifang('国四', 1)">国四</li>
						        <li class="form_li" onclick="selectpaifang('国三', 2)">国三</li>
							</ul>
						</div>

						<div class="form">
							<label class="form_control">燃油类型:</label>
							<input id="fueltype" type="hidden" />
							<ul class="fuel">
								<li class="form_li" onclick="selectranyou('汽油', 0)">汽油</li>
								<li class="form_li" onclick="selectranyou('柴油', 1)">柴油</li>
								<li class="form_li" onclick="selectranyou('电力', 2)">电力</li>
							</ul>
						</div>


						<div class="form">
							<div class="car_desc">车况描述</div>
							<textarea class="desc" id="description"></textarea>
						</div>
						<div>
							<input type="button" id="upload1" class="upload" value="立即发布" onclick="upload()" style="height:50px;width:100%;background-color:#007AFF;color:#6c6c6c;">
						</div>
					</form>
				<script>
					function isNew(val){
						if(val){
							$(".isNew").hide()
						}else{
							$(".isNew").show()
						}
					}
				</script>
				</div>
				<div id="item2" class="mui-control-content">
					<form id="form_info">
						<div class="upload_picture">
							<span>上传照片(最多15张)<!--(已选择</span>
							<span id="number">0</span>
							<span>/15)--></span>
						</div>

						<div class="release_up_pic">
							<div class="up_pic">
								<div id="chose_pic_btn2" class="col-md-1 col-xs-4">
									<img src="images/true.jpg" id="addnew2">
								</div>
							</div>
						</div>
						<div class="car_info">车辆信息</div>

						<!--<div class="form">
							<label class="form_control">品牌型号</label>
							<input type="text" id="brandmodel1" class="brand"/>
						</div>-->
						<div class="form1">
							<div id="container1">
								<div class="content1">
									<div class="left1">
										品牌型号：
									</div>
									<div class="right1 form-group">
										<input type="text" class="input1" name="brandmodel1" id="address1" placeholder="请选择">
										<span class="next-icon1"> > </span>
									</div>
								</div>
							</div>
							<section id="mymodal1">
								<div class="modal-main1">
									<p class="address-title1">品牌型号</p>
									<p class="close1">x</p>
									<ul class="optionwrapper1">
										<li class="option-menu1 option-menu-one1 active-option1">请选择</li>
										<li class="option-menu1 option-menu-two1"></li>
										<li class="option-menu1 option-menu-three1"></li>
									</ul>
									<div class="option-content1">
										<ul class="option-group1 option-group-one1" data-index1="0" style="display: block">
										</ul>
										<ul class="option-group1 option-group-two1" data-index1="1">
										</ul>
										<!--<ul class="option-group1 option-group-three1"  data-index1="2">
										</ul>-->
									</div>
								</div>
							</section>
						</div>
						<!--<div class="form">
							<label class="form_control">所在地区</label>
							<input type="text" id="city1" class="brand"/>
						</div>-->
						<div class="form">
							<li class="lis">
							    <section class="express-area">
							        <a id="expressArea1" href="javascript:void(0)">
							            <div class="form-group">
							                <!--<dt>所在城市</dt>
							                <dd class="city">省 市</dd>-->
							                <span class="cityname">所在城市:</span>
							                <input type="text" class="city1" name="city1" placeholder="省 市" style="width:50%;">
							            </div>
							        </a>

							    </section>
							    <!--选择地区弹层-->
							    <section id="areaLayer1" class="express-area-box">
							        <article id="areaBox1">
							        	<ul class="remen" id="remen1">
							        		<li class="lastli">热门城市</li>
							        		<li class="list1">北京</li>
							        		<li class="list1">上海</li>
							        		<li class="list1">广州</li>
							        		<li class="list1">深圳</li>
							        		<li class="list1">天津</li>
							        		<li class="list1">重庆</li>
							        	</ul>
							        	<div class="top">
								            <h3>选择城市</h3>
								        </div>
							            <ul id="areaList1" class="area-list" style="margin-bottom: 500px;"></ul>
							        </article>
							    </section>
							    <!--遮罩层-->
							    <div id="areaMask1" class="mask"></div>
							</li>
						</div>

						<!--<div class="list">
							<label class="time">出厂年限</label>
							<input id="select_5" />
						</div>-->

						<div class="form">
							<label class="form_control">上牌日期</label>
							<input type="text" id="registrationdate1" onclick="selectdate5()" placeholder="选择日期..." class="brand" />
						</div>

						<div class="form">
							<label class="form_control">行驶里程(万公里)</label>
							<input type="text" id="mileage1" class="brand"/>

						</div>

						<div class="form">
							<label class="form_control">马力(匹)</label>
							<input type="text" id="horsepower1" class="brand"/>
						</div>

						<div class="form">
							<label class="form_control">整车重量(吨)</label>
							<input type="text" id="weight1" class="brand"/>
						</div>

						<div class="form">
							<label class="form_control">额定载重(吨)</label>
							<input type="text" id="ratedload1" class="brand"/>
						</div>

						<div class="form">
							<label class="form_control">货箱长度(米)</label>
							<input type="text" id="containerlength1" class="brand"/>
						</div>


						<div class="form">
							<label class="form_control">货箱宽度(米)</label>
							<input type="text" id="containerwidth1" class="brand"/>
                       </div>

						<div class="form">
							<label class="form_control">货箱高度(米)</label>
							<input type="text" id="containerheight1" class="brand"/>
						</div>

						<div class="form form-group">
							<label class="form_control">报价(万)</label>
							<input type="text" id="wholesaleprice1" class="brand" name="price1"/>
						</div>

						<div class="form">
							<label class="form_control">VIP底价(万)</label>
							<input type="text" id="vipfloorprice1" class="brand"/>
						</div>

						<div class="vip">VIP会员享受VIP底价</div>

						<div class="form">
							<div class="car_desc">车况描述</div>
							<textarea class="desc" id="description1"></textarea>
						</div>
						<div>
							<input type="button" id="upload2" class="uploadtruck" onclick="uploadtruck()" value="立即发布" style="height:50px;width:100%;background-color:#007AFF;color:#6c6c6c;">
						</div>
					</form>
				</div>
				<script type="text/javascript" src="js/jquery.area.js" ></script>
			</div>

		</div>

		<script>
			mui.init({
				swipeBack: true //启用右滑关闭功能
			});
			(function($) {
				$('#scroll').scroll({
					indicators: true //是否显示滚动条
				});
				var segmentedControl = document.getElementById('segmentedControl');
				$('.mui-input-group').on('change', 'input', function() {
					if(this.checked) {
						var styleEl = document.querySelector('input[name="style"]:checked');
						var colorEl = document.querySelector('input[name="color"]:checked');
						if(styleEl && colorEl) {
							var style = styleEl.value;
							var color = colorEl.value;
							segmentedControl.className = 'mui-segmented-control' + (style ? (' mui-segmented-control-' + style) : '') + ' mui-segmented-control-' + color;
						}
					}
				});
			})(mui);
		</script>

		<script>
			//选择上牌时间
			function selectdate() {
				var dDate = new Date();
				var year = dDate.getFullYear();
				var month = dDate.getMonth() + 1;
				var strDate = dDate.getDate();
				//dDate.setFullYear(year, month, strDate);
				var minDate = new Date();
				minDate.setFullYear(2000, 0, 1);
				var maxDate = new Date();
				maxDate.setFullYear(2100, 11, 31);
				mui.plusReady(function() {
					plus.nativeUI.pickDate(function(e) {
						var d = e.date;
						$('#registrationdate').val(d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate());
					}, function(e) {}, {
						title: "请选择日期",
						date: dDate,
						minDate: minDate,
						maxDate: maxDate
					});
				});
			}

			//选择年检到期时间
			function selectdate1() {
				var dDate = new Date();
				var year = dDate.getFullYear();
				var month = dDate.getMonth() + 1;
				var strDate = dDate.getDate();
				//dDate.setFullYear(year, month, strDate);
				var minDate = new Date();
				minDate.setFullYear(2000, 0, 1);
				var maxDate = new Date();
				maxDate.setFullYear(2100, 11, 31);
				mui.plusReady(function() {
					plus.nativeUI.pickDate(function(e) {
						var d = e.date;
						$('#yearinsurance').val(d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate());
					}, function(e) {}, {
						title: "请选择日期",
						date: dDate,
						minDate: minDate,
						maxDate: maxDate
					});
				});
			}

			//选择商业险到期时间
			function selectdate2() {
				var dDate = new Date();
				var year = dDate.getFullYear();
				var month = dDate.getMonth() + 1;
				var strDate = dDate.getDate();
				//dDate.setFullYear(year, month, strDate);
				var minDate = new Date();
				minDate.setFullYear(2000, 0, 1);
				var maxDate = new Date();
				maxDate.setFullYear(2100, 11, 31);
				mui.plusReady(function() {
					plus.nativeUI.pickDate(function(e) {
						var d = e.date;
						$('#commercialinsurance').val(d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate());
					}, function(e) {}, {
						title: "请选择日期",
						date: dDate,
						minDate: minDate,
						maxDate: maxDate
					});
				});
			}

			//选择交强险到期时间
			function selectdate3() {
				var dDate = new Date();
				var year = dDate.getFullYear();
				var month = dDate.getMonth() + 1;
				var strDate = dDate.getDate();
				//dDate.setFullYear(year, month, strDate);
				var minDate = new Date();
				minDate.setFullYear(2000, 0, 1);
				var maxDate = new Date();
				maxDate.setFullYear(2100, 11, 31);
				mui.plusReady(function() {
					plus.nativeUI.pickDate(function(e) {
						var d = e.date;
						$('#compulsoryinsurance').val(d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate());
					}, function(e) {}, {
						title: "请选择日期",
						date: dDate,
						minDate: minDate,
						maxDate: maxDate
					});
				});
			}


			//货车选择上牌时间   registrationdate1
			function selectdate5() {
				var dDate = new Date();
				var year = dDate.getFullYear();
				var month = dDate.getMonth() + 1;
				var strDate = dDate.getDate();
				//dDate.setFullYear(year, month, strDate);
				var minDate = new Date();
				minDate.setFullYear(2000, 0, 1);
				var maxDate = new Date();
				maxDate.setFullYear(2100, 11, 31);
				mui.plusReady(function() {
					plus.nativeUI.pickDate(function(e) {
						var d = e.date;
						$('#registrationdate1').val(d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate());
					}, function(e) {}, {
						title: "请选择日期",
						date: dDate,
						minDate: minDate,
						maxDate: maxDate
					});
				});
			}

//		    $(function () {
//		    	$("#brand-box").hide();
//		    });
		    //=================获取不重复的uuid  start====================
					function S4() {
				        return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
				    }
				    function guid() {
				        return (S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
				    }

			// 上传文件
			function upload() {
				var task = plus.uploader.createUpload(servicePath+'sechandcar/app/sys/save', {
						method: "POST"
					},
					function(t, status) { //上传完成
						if(status == 200) {
							if(t.responseText == 'success') {
								mui.toast('发布成功');
								//window.location.reload(true);
//								window.location.href = "index1.html";
//								$("input").attr("value", "");
//								$(".form_li").removeClass('selected');

								$('#form_info1')[0].reset();

								mui.openWindow({
									id: 'car'+guid(),
									url: 'index1.html',
//									createNew: true,
									waiting: {
										autoShow: true,
										title: '正在加载...',
									},
									extras: {
										ids: "carlistnew"
									}
								});
							} else {
								mui.toast('发布失败');
							}

						} else {
							console.log("上传失败：" + status);
						}
					}
				);

				for(var i = 0; i < files.length; i++) {
					var f = files[i];
					task.addFile(f.path, {
						key: f.name
					});
				}
				var brandmodel = $('#address').val();
				var city = $('.city').val();
				var wholesaleprice = $('#wholesaleprice').val();
				if(brandmodel == "" || city == "" || wholesaleprice == ""){
					alert("请输入品牌型号、城市和报价");
					return false;
				}
				$("#upload1").attr("disabled",true);
				var cartype = $('#cartype').val();
				var outputvolume = $('#outputvolume').val();
				var transmission = $('#transmission').val();
				var color = $('#colornames').html();
				var mileage = $('#mileage').val();
				var registrationdate = $('#registrationdate').val();
				if(registrationdate == "选择日期..."){
					registrationdate = "";
				}
				var yearinsurance = $('#yearinsurance ').val();
				if(yearinsurance == "选择日期..."){
					yearinsurance = "";
				}
				var commercialinsurance = $('#commercialinsurance ').val();
				if(commercialinsurance == "选择日期..."){
					commercialinsurance = "";
				}
				var compulsoryinsurance = $('#compulsoryinsurance ').val();
				if(compulsoryinsurance == "选择日期..."){
					compulsoryinsurance = "";
				}
				var vipfloorprice = $('#vipfloorprice').val();
				var emissionstandard = $('#paifang').val();
				var outputvolume = $('#outputvolume').val();
				var fueltype = $('#fueltype').val();
				var description = $('#description').val();
			    var tel = window.localStorage.getItem("telephone");
			    var nickname = window.localStorage.getItem("nickname");
			    var adduserid = window.localStorage.getItem("id");
				task.addData('color', color);
				task.addData('transmission', transmission);
				task.addData('fueltype', fueltype);
				task.addData('emissionstandard', emissionstandard);
				task.addData('compulsoryinsurance', compulsoryinsurance);
				task.addData('commercialinsurance', commercialinsurance);
				task.addData('yearinsurance', yearinsurance);
				task.addData('cartype', cartype);
				task.addData('brandmodel', brandmodel);
				task.addData('city', city);
				task.addData('registrationdate', registrationdate);
				task.addData('mileage', mileage);
				task.addData('wholesaleprice', wholesaleprice);
				task.addData('vipfloorprice', vipfloorprice);
				task.addData('description', description);
				task.addData('telephone',tel);
				task.addData('nickname', nickname);
				task.addData('adduserid', adduserid);
				task.addData('outputvolume', outputvolume);
				task.start();

			}

			//货车发布上传
			function uploadtruck() {
				
				var task = plus.uploader.createUpload(servicePath+'sechandcar/app/sys/savetruck', {
						method: "POST"
					},
					function(t, status) { //上传完成
						if(status == 200) {
							if(t.responseText == 'success') {
								mui.toast('发布成功');
//								window.location.reload(true);


								$('#form_info')[0].reset();

								mui.openWindow({
									id: 'truck'+guid(),
									url: 'index1.html',
//									createNew: true,
									waiting: {
										autoShow: true,
										title: '正在加载...',
									},
									extras: {
										idss: "trucklistnew"
									}
								});
							} else {
								mui.toast('发布失败');
							}

						} else {
							console.log("上传失败：" + status);
						}
					}
				);

				for(var i = 0; i < files2.length; i++) {
					var f = files2[i];
					console.log("files2["+ i +"]" + f.path);
					task.addFile(f.path, {
						key: f.name
					});

				}
				var brandmodel = $('#address1').val();
				var city = $('.city1').val();
				var wholesaleprice = $('#wholesaleprice1').val();
				if(brandmodel == "" || city == "" || wholesaleprice == ""){
					alert("请输入品牌型号、城市和报价");
					return false;
				}
				$("#upload2").attr("disabled",true);
				var registrationdate = $('#registrationdate1').val();
				if(registrationdate == "选择日期..."){
					registrationdate = "";
				}
				var mileage = $('#mileage1').val();
				var horsepower = $('#horsepower1').val();
				var weight = $('#weight1').val();
				var ratedload = $('#ratedload1').val();
				var containerlength = $('#containerlength1').val();
				var containerwidth = $('#containerwidth1').val();
				var containerheight = $('#containerheight1').val();
				var vipfloorprice = $('#vipfloorprice1').val();
				var description = $('#description1').val();
				var tel = window.localStorage.getItem("telephone");
				var nickname = window.localStorage.getItem("nickname");
				var adduserid = window.localStorage.getItem("id");
				task.addData('brandmodel', brandmodel);
				task.addData('city', city);
				task.addData('registrationdate', registrationdate);
				task.addData('mileage', mileage);
				task.addData('horsepower', horsepower);
				task.addData('weight', weight);
				task.addData('ratedload', ratedload);
				task.addData('containerlength', containerlength);
				task.addData('containerwidth', containerwidth);
				task.addData('containerheight', containerheight);
				task.addData('wholesaleprice', wholesaleprice);
				task.addData('vipfloorprice', vipfloorprice);
				task.addData('telephone',tel);
				task.addData('nickname', nickname);
				task.addData('adduserid', adduserid);
				task.addData('description', description);
				task.start();
			}

			//选择车辆类型
			function selecttype(typename,index) {
				$('#cartype').val(typename);
				$(".form .cartp .form_li").removeClass("active");
				$(".form .cartp .form_li").eq(index).addClass("active");
			}

			//选择品牌型号
			function selectbrand(value, imgurl) {
//				$("#brand-box").hide();
				document.getElementById('form_info').style.display = 'block';
				document.getElementById('infoheader').style.display = 'block';
				$('#brandmodel').val(value);
			}

			//选择变速箱
			function selecttransmission(transmission, index) {
				$('#transmission').val(transmission);
				$(".form .transm .form_li").removeClass("active");
				$(".form .transm .form_li").eq(index).addClass("active");
			}

			//选择车身颜色
			function selectcolor(id, colorname) {
			    console.log(colorname);
				$('#colornames').empty();
				$('#colornames').html(colorname);

			}

			//选择排放标准
			function selectpaifang(paifang, index) {
				$('#paifang').val(paifang);
				$(".form .output .form_li").removeClass("active");
				$(".form .output .form_li").eq(index).addClass("active");
			}

			//选择燃油标准
			function selectranyou(ranyou, index) {
				$('#fueltype').val(ranyou);
				$(".form .fuel .form_li").removeClass("active");
				$(".form .fuel .form_li").eq(index).addClass("active");
			}
		</script>
		<script type="text/javascript">
			$(document).ready(function() {
				var newData = [];//新数据
				var citysArray = [];//城市
				var areaArray = [];//地区
				var chooseMenuStr = '请选择' //添加选择title

				var newData1 = [];//新数据
				var citysArray1 = [];//城市
				var areaArray1 = [];//地区
				var chooseMenuStr1 = '请选择' //添加选择title
				//var datacar;
				//var datatruck;

				/*$.ajax({
					url: servicePath+"sechandcar/app/sys/carBrandModel",
					async: false,
					type: "post",
					//dataType: "json",
					//data: {"id":$("input[name='id']").val()},
					data: {},
					success: function(data) {
						datacar = data;
					},
					error: function(data) {
						window.alert("删除失败");
						//window.alert(data);
					}
				});
				$.ajax({
					url: servicePath+"sechandcar/app/sys/truckBrandModel",
					async: false,
					type: "post",
					//dataType: "json",
					//data: {"id":$("input[name='id']").val()},
					data: {},
					success: function(data) {
						datatruck = data;
					},
					error: function(data) {
						window.alert("删除失败");
						//window.alert(data);
					}
				});*/

				var datacar;
				var datatruck;
				function init(){
					//模拟ajax
					$.ajax({
						type: "get",
						url: servicePath+"sechandcar/app/sys/queryCarBrand",
						async: false,
						data: {},
						dataType: "json",
						success: function(data){
							datacar = data;
						},
						error: function(data){
							
						}
					});
					setTimeout(()=>{
						newData = [...datacar];
						// 初始化省份
						var optionGroupOne = "";
						var index;
						$.each(newData,function(index, el) {  
							index1 = newData[index]["id"];   
							//console.log(index);
					        var li = '<li class="option-list option-list-one" data-index="'+index1+'">';
								li += '<span>'+newData[index]["brandname"]+'</span>';        
								li += '<div class="checked">';
								li += '</div>';
								li += '</li>';      
							//alert(newData[index]["brandname"]);    
							optionGroupOne += li;
						});
						$(".option-group-one").html(optionGroupOne)

					},100)
				}   
				function init1(){
					$.ajax({
						type: "get",
						url: servicePath+"sechandcar/app/sys/queryTruckBrand",
						async: false,
						data: {},
						dataType: "json",
						success: function(data){
							datatruck = data;
						},
						error: function(data){
							
						}
					});
					//模拟ajax
					setTimeout(()=>{
						newData1 = [...datatruck];
						var index2;
						// 初始化省份
						var optionGroupOne1 = "";
						$.each(newData1,function(index, el) {
							index2 = newData1[index]["id"];   
					        var li = '<li class="option-list1 option-list-one1" data-index="'+index2+'">';
								li += '<span>'+newData1[index]["brandname"]+'</span>';        
								li += '<div class="checked">';
								li += '</div>';
								li += '</li>';      
							optionGroupOne1 += li;
						});      
						$(".option-group-one1").html(optionGroupOne1)
					},100) 
				}
    
				init();
				init1();


				$("#mymodal").on("click",".option-menu",function(){ //菜单激活
					var i = $(this).index();
					$(this).addClass('active-option').siblings().removeClass('active-option');
					$(".option-group").eq(i).show().siblings().hide()
				})
				$("#mymodal1").on("click",".option-menu1",function(){ //菜单激活
					var i1 = $(this).index();
					$(this).addClass('active-option').siblings().removeClass('active-option');
					$(".option-group1").eq(i1).show().siblings().hide()
				})

				//1级 省份点击添加城市
				$("#mymodal").on("click",".option-list-one",function(){
					var carModel;
					var parentIndex = $(this).parent().attr("data-index");
					var provinceName = $(this).text().trim();
					var provinceIndex = $(this).index();
					$(this).find('.checked').show();
					$(this).siblings().find('.checked').hide();
					// console.log(newData[provinceIndex])
					brandid = $(this).attr("data-index");  
					//alert(brandid);   
					$.ajax({
						type: "get",
						url: servicePath+"sechandcar/app/sys/queryCarModel",
						async: false,
						data: {"brandid":brandid},
						dataType: "json",
						success: function(data){
							carModel = data;
						},
						error: function(data){
							
						}
					});
					//citysArray = newData[provinceIndex]["c"];
					$(".option-menu").eq(parentIndex).text(provinceName)
					var cityStr = "";
					// console.log(citysArray)
					$.each(carModel,function(index, el) {
						var li = "";
						li += '<li class="option-list option-list-two" data-brand="'+carModel[index]["brandid"]+'" data-model="'+carModel[index]["id"]+'">'
							  + '<span>'+carModel[index]["modelname"]+'</span>'  
							  +	'<div class="checked">'  
							  + '</div>'
							  + '</li>';
						cityStr += li;
					});
					$(".option-group").hide();
					$(".optionwrapper").find(".option-menu").removeClass('active-option')
					$(".option-menu-two").html(chooseMenuStr).addClass('active-option')
					$(".option-group-two").html(cityStr).show();
					$(".option-group-three").html("");
					$(".option-menu-three").html("")
				})

				$("#mymodal1").on("click",".option-list-one1",function(){
					var truckModel;
					var parentIndex1 = $(this).parent().attr("data-index1");
					var provinceName1 = $(this).text().trim();
					var provinceIndex1 = $(this).index();
					$(this).find('.checked').show();
					$(this).siblings().find('.checked').hide();
					// console.log(newData1[provinceIndex1])
					citysArray1 = newData1[provinceIndex1]["c"];
					$(".option-menu1").eq(parentIndex1).text(provinceName1);
					brandid = $(this).attr("data-index");  
					//alert(brandid);   
					$.ajax({
						type: "get",
						url: servicePath+"sechandcar/app/sys/queryTruckModel",
						async: false,
						data: {"brandid":brandid},  
						dataType: "json",
						success: function(data){
							truckModel = data;
						},
						error: function(data){
							
						}
					});
					var cityStr1 = "";
					// console.log(citysArray1)
					$.each(truckModel,function(index, el) {
						var li = "";
						li += '<li class="option-list1 option-list-two1" data-brand="'+truckModel[index]["brandid"]+'" data-model="'+truckModel[index]["id"]+'">'
							+ '<span>' +truckModel[index]["modelname"]+ '</span>';
							+ '<div class="checked">';          
						    + '</div>';
							+ '</li>';    
						cityStr1 += li;    
					});
					// console.log(cityStr)
					$(".option-group1").hide();
					$(".optionwrapper1").find(".option-menu1").removeClass('active-option')
					$(".option-menu-two1").html(chooseMenuStr1).addClass('active-option')
					$(".option-group-two1").html(cityStr1).show();
					$(".option-group-three1").html("");
					$(".option-menu-three1").html("")
				})

 				
				//2级 城市点击添加城镇
				$("#mymodal").on("click",".option-list-two",function(){
					var carStyle;
					var parentIndex = $(this).parent().attr("data-index");
					var cityName = $(this).text().trim();
					var cityIndex = $(this).index();
					$(this).find('.checked').show();
					$(this).siblings().find('.checked').hide();
					//cityArray = citysArray[cityIndex]["a"];
					$(".option-menu").eq(parentIndex).text(cityName)
					var areaStr = "";
					var brandid;
 					var modelid;
					brandid = $(this).attr("data-brand");  
					modelid = $(this).attr("data-model");
					//alert(brandid);
					//alert(modelid);  
					$.ajax({
						type: "get",
						url: servicePath+"sechandcar/app/sys/queryCarStyle",
						async: false,
						data: {"brandid":brandid,
						       "modelid":modelid},
						dataType: "json",
						success: function(data){
							carStyle = data;
						},
						error: function(data){
							
						}
					});
					$.each(carStyle,function(index, el) {  
						areaStr += `<li class="option-list option-list-three">
								<span>${carStyle[index]["stylename"]}</span>
								<div class="checked">
								</div>
							</li>`
					});
					$(".option-group").hide();
					$(".optionwrapper").find(".option-menu").removeClass('active-option')
					$(".option-menu-three").html(chooseMenuStr).addClass('active-option')
					$(".option-group-three").html(areaStr).show();
				})
				$("#mymodal1").on("click",".option-list-two1",function(){
					var parentIndex1 = $(this).parent().attr("data-index1");
					var cityName1 = $(this).text().trim();
					var cityIndex1 = $(this).index();
					$(this).find('.checked').show();
					$(this).siblings().find('.checked').hide();
					//cityArray1 = citysArray1[cityIndex1]["a"];
					$(".option-menu1").eq(parentIndex1).text(cityName1)
					var menuOne1 = $(".option-menu1").eq(0).text();
					var menuTwo1 = $(".option-menu1").eq(1).text();  
					var addressVal1 = menuOne1 +" "+ menuTwo1;
					$(this).find('.checked').show();
					$(this).siblings().find('.checked').hide();
					$(".modal-main1").animate({"bottom":"-900px"}, 400);
					setTimeout(()=>{
						$("#mymodal1").fadeOut()
					},350)
					$("#address1").val(addressVal1);   
					  
				})
				//3级 选择城镇
				$("#mymodal").on("click",".option-list-three",function(){
					var areaName = $(this).text().trim();
					var parentIndex = $(this).parent().attr("data-index");
					var menuOne = $(".option-menu").eq(0).text();  
					var menuTwo = $(".option-menu").eq(1).text();
					var addressVal = menuOne +" "+ menuTwo +" "+ areaName;
					$(this).find('.checked').show();
					$(this).siblings().find('.checked').hide();
					$(".option-menu").eq(parentIndex).text(areaName)
					$(".modal-main").animate({"bottom":"-900px"}, 400);
					setTimeout(()=>{
						$("#mymodal").fadeOut()  
					},350)
					$("#address").val(addressVal)
				})
				/*$("#mymodal1").on("click",".option-list-three1",function(){
					var areaName1 = $(this).text().trim();
					var parentIndex1 = $(this).parent().attr("data-index1");
					var menuOne1 = $(".option-menu1").eq(0).text();
					var menuTwo1 = $(".option-menu1").eq(1).text();
					var addressVal1 = menuOne1 +" "+ menuTwo1 +" "+ areaName1;
					$(this).find('.checked').show();
					$(this).siblings().find('.checked').hide();
					$(".option-menu1").eq(parentIndex1).text(areaName1)
					$(".modal-main1").animate({"bottom":"-900px"}, 400);
					setTimeout(()=>{
						$("#mymodal1").fadeOut()
					},350)
					$("#address1").val(addressVal1)  
				})*/

				$(".right").on("click",function(){
					$("#mymodal").show();
					$(".modal-main").animate({"bottom":"0"}, 400)
				})

				$(".right1").on("click",function(){
					$("#mymodal1").show();
					$(".modal-main1").animate({"bottom":"0"}, 400)
				})


				$(".close").on("click",function(){
					$(".modal-main").animate({"bottom":"-900px"}, 400);
					setTimeout(()=>{
						$("#mymodal").fadeOut();
					},350)
				})

				$(".close1").on("click",function(){
					$(".modal-main1").animate({"bottom":"-900px"}, 400);
					setTimeout(()=>{
						$("#mymodal1").fadeOut();
					},350)
				})

				$("#mymodal").on("click",function(event){
					var modalMain = $(".modal-main");
					if (!modalMain.is(event.target)&& modalMain.has(event.target).length === 0) {
						$(".modal-main").animate({"bottom":"-900px"}, 400);
						setTimeout(()=>{
							$("#mymodal").fadeOut();
						},350)
					}

				})
				$("#mymodal1").on("click",function(event){
					var modalMain1 = $(".modal-main1");
					if (!modalMain1.is(event.target)&& modalMain1.has(event.target).length === 0) {
						$(".modal-main1").animate({"bottom":"-900px"}, 400);
						setTimeout(()=>{
							$("#mymodal1").fadeOut();
						},350)
					}

				})
			});
		</script>
	</body>

</html>
